<template>
	<view class="detail-set">
		<custom-navi :show-home="false">店铺管理</custom-navi>
		<!-- <custom-navi :show-home="false">店铺管理<view class="putin" @click="record">修改记录</view></custom-navi> -->
		<view class="msghead">
			<view class="msg">
				<view class="msg-title">
					店铺头像
				</view>
				<!-- <image
      v-if="!shopInfo.defaultHead"
        src="/static/tabbar/common_ic_jilu_red.png"
        class="image"
        @tap="handleNavTo('/src/pages/my/pages/headImgSet/index')"
      ></image> -->
				<view class="msg-icon" @tap="handleNavTo('/src/pages/my/pages/headImgSet/index')">
					<image src="../../../../../static/little-more.png" mode=""></image>
				</view>
				<view class="msg-img">
					<image v-if="shopInfo.defaultHead" :src="basic+shopInfo.defaultHead" class="image" @tap="handleNavTo('/src/pages/my/pages/headImgSet/index')"></image>
				</view>
				<!-- <view class="msg-rigth">
        <view>{{ shopInfo.shopName }}</view>
        <view>帐号：{{ info.networkname }}</view>
      </view> -->
			</view>
		</view>
		<item v-for="(item, index) in itemList" :key="index" :params="item"></item>
		<!-- <view class="btn">
      <button @tap="handleLogOut">退出当前帐号</button>
    </view> -->
	</view>
</template>

<script>
	import CONSTS from '@/src/consts';
	import item from '../../components/detailItme'
	import {
		getUserInfo
	} from '@/src/basic/utils/user';

	import {
		loginOut,
		getStoreInformation,
		storeInformationById
	} from '../../api'
	export default {
		data() {
			return {
				basic: CONSTS.BASE_URL + '/basic',
				info: getUserInfo(),
				shopInfo: {},
				shopId: '',
				itemList: [{
						title: '门店名称',
						val: '',
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/msgSet/index',
						params: {
							type: 'shopName'
						}
					},
					{
						title: '门店品类',
						val: '',
						margin: 20,
						more: true,
						url: '/src/pages/my/pages/classify/index',
						params: {
							type: ''
						}
					},
					{
						title: '门店电话',
						val: '',
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/msgSet/index',
						params: {
							type: 'phone'
						}
					},
					{
						title: '门店地址',
						val: '',
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/msgSet/index',
						params: {
							type: 'detailAddress'
						}
					},
					{
						title: '营业时间',
						val: '',
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/timeSet/index'
					},
					{
						title: '营业状态',
						val: 2,
						valColor: '#0CD4D3',
						margin: 0,
						more: true,
						params: {
							status: 2
						},
						url: '/src/pages/my/pages/statusSet/index'
					},
					{
						title: '消费水平设置',
						val: '',
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/average/index',
						params: {
							type: 'perCapitaPrice'
						}
					},
					{
						title: '商户标签',
						val: '',
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/label/index',
						params: {
							type: 'perCapitaPrice'
						}
					}
				]
			}
		},
		components: {
			item
		},
		onShow() {
			const _self = this
			uni.getStorage({
				key: 'shopInfo',
				success: function(res) {
					_self.shopId = res.data.id
				}
			});
			this.handleGetShopMsg()
			uni.removeStorageSync('streetData');
		},
		methods: {
			record() {
				uni.navigateTo({
					url: '../alterRecord/index'
				});
			},
			async handleLogOut() {
				this.$loading()
				try {
					const {
						data
					} = await loginOut()
					uni.clearStorage();
					setTimeout(() => {
						this.$hideLoading()
						this.$utils.common.navigateTo('src/pages/login/index')
					}, 1500)
				} catch (err) {
					if (err.code !== 200) {
						return this.$utils.common.toast.fail(err.data.message);
					}
				}
			},
			async handleGetShopMsg() {
				let params = {
					id: this.shopId
				}
				try {
					const {
						data
					} = await storeInformationById(params)
					console.log(data)
					// this.$hideLoading()
					this.shopInfo = data
					uni.setStorageSync('shopInfo', data)
					uni.setStorageSync('week', data.weekDay);
					this.handleChangeDetailInfo(data)
				} catch (err) {
					if (err.code) {
						if (err.code !== 200) {
							return this.$utils.common.toast.fail(err.data.message);
						}
						return this.$utils.common.toast.fail(err.errMsg);
					}
				}
			},

			handleChangeDetailInfo(res) {
				console.log(res)
				let time = res.businessTime.split(',')
				// const weekDayDisplay = res.weekDayDisplay||''
				this.itemList[0].val = res.shopName || ''
				this.itemList[1].val =
					`${res.storeTotalTypeDisPlay || ''} ${res.storeSonTypeDisPlay || ''} ${res.storeThreeTypeDisPlay || ''}`
				this.itemList[2].val = res.phone || ''
				this.itemList[3].val = res.detailAddress || ''
				const weekDayDisplay = res.weekDay && res.weekDay.split(",") || ''
				const strArr = ["日", "一", "二", "三", "四", "五", "六"]
				if (weekDayDisplay) {
					console.log(weekDayDisplay)
					if (weekDayDisplay.length <= 4) {
						let txt = []
						for (var i = 0; i < strArr.length; i++) {
							for (var j = 0; j < weekDayDisplay.length; j++) {
								if (weekDayDisplay[j] - 1 == i) {
									txt.push('周' + strArr[i])
								}
							}
						}
						console.log(txt)
						this.itemList[4].val = txt.join(',')
					} else if (weekDayDisplay.length == 7) {
						this.itemList[4].val = '全周'
					} else if (weekDayDisplay.length > 4) {
						let txt = []
						let a = new Set(['1', '2', '3', '4', '5', '6', '7']);
						let b = new Set(weekDayDisplay);


						// 差集
						let difference = ([...a].filter(x => !b.has(x)));
						// txt = new Set([strArr].filter(x => !this.weekSrt.has(x)));
						for (var i = 0; i < strArr.length; i++) {
							for (var j = 0; j < difference.length; j++) {
								if (difference[j] - 1 == i) {
									txt.push('周' + strArr[i])
								}
							}
						}
						// console.log(difference)
						this.itemList[4].val = '除' + txt.join(',') + '外'
					} else {
						this.itemList[4].val =
							`周${strArr[weekDayDisplay[0]-1]} 至 周${strArr[weekDayDisplay[this.weekDayDisplay.length-1]-1]}` || ''
					}
					// this.itemList[4].val =
					// 	`周${strArr[weekDayDisplay[0]-1]} 至 周${strArr[weekDayDisplay[weekDayDisplay.length-1]-1]}   ${time[0]}` || ''
				} else {
					this.itemList[4].val = ''
				}
				// this.itemList[4].val = `${weekDayDisplay[0]} 至 ${weekDayDisplay[weekDayDisplay.length - 1]}   ${res.openingTime} - ${res.closingTime}` || ''
				this.itemList[5].val = res.businessState || 2
				this.itemList[5].params.status = res.businessState || 2
				this.itemList[6].val = `人均消费￥${res.perCapitaPrice}` || ''
				this.itemList[7].val = res.storeTags
			},
			handleNavTo(url) {
				return this.$utils.common.navigateTo(url)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.detail-set {
		.putin {
			// height: 23rpx;
			line-height: 44rpx;
			position: absolute;
			top: 0;
			right: 32rpx;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			opacity: 1;

		}

		.btn {
			position: fixed;
			bottom: 116rpx;
			width: 100vw;
			display: flex;
			justify-content: center;

			button {
				font-size: 34rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: rgba(255, 255, 255, 1);
				width: 686rpx;
				height: 88rpx;
				background: rgba(12, 212, 211, 1);
				opacity: 1;
				border-radius: 10rpx;
			}
		}

		.msghead {
			background: rgba(255, 255, 255, 1);
		}

		.msg {
			margin: 0rpx 34rpx;
			height: 100rpx;
			line-height: 100rpx;
			background-color: #ffffff;
			// display: flex;
			align-items: center;
			// margin-bottom: 20rpx;
			border-bottom: 1rpx solid #e6e6e6;

			view {
				display: inline-block;
			}

			&-img {
				float: right;
				height: 100rpx;
				padding: 14rpx 0 0 0;
			}

			&-icon {
				float: right;
				margin-left: 20rpx;

				image {
					width: 18rpx;
					height: 18rpx;
				}
			}

			&-title {
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: rgba(80, 80, 80, 1);
				opacity: 1;
			}

			.image {
				width: 72rpx;
				height: 72rpx;
				border-radius: 84rpx;
			}

			&-rigth {
				margin-left: 32rpx;

				view:nth-child(1) {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(80, 80, 80, 1);
					margin-bottom: 2rpx;
				}

				view:nth-child(2) {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(80, 80, 80, 1);
				}
			}
		}
	}
</style>
